<!--
 * @FileDescription 维修手册
 * @Author lz
 * @Date 20230612 15:21:12
 * @LastEditors lz
 * @LastEditTime 20230612 15:21:12
-->
<template>
    <div class="ServBox">
        <div class="Popup">
            <div class="titBox">
                维修手册
                <close-outlined class="cancel" @click="cancel" />
            </div>
            <div class="manualBox">
                <pdfPreview :Url="data.pdfUrl" Name="电路图"/>
            </div>
        </div>
    </div>
</template>

<script setup lang="ts">
import { CloseOutlined } from '@ant-design/icons-vue';
import pdfPreview from '../../../PDFViewer/PDFViewer.vue';
import { onMounted, reactive, ref } from 'vue';
import HomeContent from '../HomeContent';
import { ClientMessage } from '@runtime/generate/message/ClientMessage';
import WebSocketComponent from '@runtime/module/WebSocket/WebSocketComponent';
import MessageCode from '../MessageCode';
const data = reactive({
    pdfUrl: '/电路图.pdf',
})
function cancel() {
    WebSocketComponent.Default.PostMessage(new ClientMessage.DiagnosisAdapterMessage(MessageCode.Default.MsgCodesList.INFORMATION_CLOSE))
    HomeContent.Default.ServiceShow.value = false
}   
onMounted(async () => {

})
</script>

<style scoped>
.ServBox {
    width: 100%;
    height: 100%;
    background-color: rgb(0, 0, 0, 0.1);
    position: relative;
}

.Popup {
    width: 1440px;
    height: 940px;
    background: #FFFFFF;
    border-radius: 16px 16px 16px 16px;
    opacity: 1;
    position: absolute;
    left: 50%;
    top: 45%;
    transform: translate(-50%, -50%);
}

.titBox {
    height: 54px;
    font-size: 36px;
    font-weight: 600;
    color: #000000;
    line-height: 42px;
    margin-top: 30px;
    margin-left: 40px;
}

.cancel {
    font-size: 28px;
    font-weight: 600;
    float: right;
    margin-top: 4px;
    margin-right: 30px;
}
.manualBox{
    width: 100%;
    height: 850px;
}
</style>